export const PROJECT = () => {
  const eyeUtilDict = {
      kind: "bool" as const,
      options: {
          Default: "顔パーツ/目/開き",
          Open: "顔パーツ/目/開き",
          HalfOpen: "顔パーツ/目/やや開き",
          HalfClosed: "顔パーツ/目/やや閉じ",
          Closed: "顔パーツ/目/閉じ",
      }
  }
  const mouthUtilDict = {
      kind: "bool" as const,
      options: {
          Default: "顔パーツ/口/閉じ",
          a: "顔パーツ/口/あ",
          i: "顔パーツ/口/い",
          u: "顔パーツ/口/う",
          e: "顔パーツ/口/え",
          o: "顔パーツ/口/お",
          x: "顔パーツ/口/閉じ",
      }
  }
  const LipSync = createLipSync(mouthUtilDict)
  const Blink = createBlink(eyeUtilDict)
  return (
    <Project>
      <TimeLine>
        <Clip label="Hello">
          <PsdCharacter psd="../assets/フリー.psd">
            <MotionSequence>
              <Block>
                <Voice voice="../assets/001.wav" volume={0.5} />
                <LipSync data={lipsync1} />
              </Block>
              <Voice voice="../assets/002.wav" />
            </MotionSequence>
            <Blink data={blink1} />
            <DeclareVariable variableName="t" initValue={0}>
              <DeclareAnimation f={async (ctx, variables) => {
                await ctx.move(variables["t"]).to(1, seconds(1), BEZIER_SMOOTH)
              }}>
                <Motion motion={(variables, frames) => {
                  const t = variables["t"].get(frames[0])
                  if (t == 1) {
                      return {}
                  } else if (t < 0.5) {
                    return {
                      [eyeUtilDict.options.Open]: false,
                      [eyeUtilDict.options.Closed]: true,
                    }
                  } else {
                    return {
                      [eyeUtilDict.options.Open]: true,
                      [eyeUtilDict.options.Closed]: false,
                    }
                  }
                }} />
              </DeclareAnimation>
            </DeclareVariable>
          </PsdCharacter>
        </Clip>
      </TimeLine>
    </Project>
  )
}